// 配置展示开关
var isConfig = false;
// 连续对话内容保存
var contents = "";
// 最后一次的回复内容
var lastRespContent = "";
// 流式返回当前回答的内容 id
var msgId = "";
// 初始消息
var messages = [{
    isSent: false, avatar: '/image/chatgpt.png', username: 'chatGpt', time: format(new Date()), content: '欢迎使用 chatGpt AI 助手'
},]

function created() {
    for (const data of messages) {
        var msgDiv = getMsgDiv(data);
        $("#msgsDiv").append(msgDiv)
    }
}

// 发送消息
function sendMsg() {
    var content = $("#content").val();
    if (content != null && content.trim() !== '') {
        // 发送信息展示
        appendDivMsg(true, "", "用户", escapeHtml(content))
        // 获取实际请求消息内容
        let reqContent = getReqContent();

        // 是否使用流式对话
        let isSseDialogue = $("#sseDialogue").val() === 'true';
        if (isSseDialogue) {
            var uuid = randomString(16);
            sseChat(reqContent, uuid);
        } else {
            postChat(reqContent);
        }
    } else {
        alert("没有输入内容")
    }

}

/**
 * 处理连续对话
 *
 * 连续对话:  || 分隔对话内容进行请求， 携带历史对话请求
 * 非连续对话: 输入什么对话内容使用说明
 * 继续： 将使用上次回答作为请求, 进行继续回答内容
 */
function getReqContent() {
    var content = $("#content").val();
    let continuousDialogue = $("#continuousDialogue").val() === 'true';
    if (content === "继续") {
        // 如果为继续，读取上次回答的 100 字内容
        if (lastRespContent.length > 100) {
            content = lastRespContent.substring(lastRespContent.length - 100)
        } else {
            content = lastRespContent
        }
    } else if (continuousDialogue) {
        // 如果开启的连续对话, 追加历史对话数据
        if (contents !== '') {
            contents += "||" + $("#content").val();
        } else {
            contents = $("#content").val();
        }
        content = contents;
    }
    return content;
}

/**
 * 普通请求对话
 */
function postChat(reqContent) {

    let data = {
        content: reqContent, model: $("#model").val(), maxTokens: $("#maxTokens").val(), temperature: $("#temperature").val()
    }
    // 发送请求
    request("/gpt/chat", data, "post")

}

/**
 * 流式请求对话
 */
function sseChat(reqContent, msgId) {
    reqContent = encodeURIComponent(reqContent);
    let model = encodeURIComponent($("#model").val());
    let maxTokens = encodeURIComponent($("#maxTokens").val());
    let temperature = encodeURIComponent($("#temperature").val());
    let uri = "/gpt/chat/sse?content=" + reqContent + "&model=" + model + "&maxTokens=" + maxTokens + "&temperature=" + temperature;
    let isSse = false;
    lastRespContent = "";
    // 双不等号，可以避免为空值的判断
    if (!!window.EventSource) {
        let source = new EventSource(uri);

        source.onmessage = function (e) {
            let data = JSON.parse(e.data);
            let content = escapeHtml(data.value)
            // let content = escapeHtml(e.data)
            if (!isSse) {
                appendDivMsg(false, "/image/chatgpt.png", "cahtGpt", content, msgId)
                isSse = true;
            } else {
                $("#" + msgId).append(content)
            }
            lastRespContent += content
            // console.log(e.data);
        };

        //建立连接
        source.onopen = function (evt) {
            console.log("server connect success");
        }
        //错误
        source.onerror = function (evt) {
            console.log("Error occurred fail");
            //appendDivMsg(false, "/image/chatgpt.png", "cahtGpt", "请求错误,请检查模型配置是否正确")
            source.close()
        }
    } else {
        console.log("你的浏览器不支持sse ")
    }
}


// 监听回车发送消息（13是回车的代号）
$(document).keydown(function (event) {
    console.log("---altKey=" + event.altKey + "  ctrlKey=" + event.ctrlKey + "  keyCode=" + event.keyCode)
    if (event.altKey && event.keyCode == 13) {
        // 执行的方法
        sendMsg();
    }
});

/**
 * 配置开关+默认隐藏
 */

function configParams() {
    if (isConfig) {
        $("#configParams").hide(300);
        isConfig = false;
    } else {
        $("#configParams").show(300);
        isConfig = true;
    }
}


function getMsgDiv(data, msgId) {
    var msgTp = $('#msgTp').html();
    msgTp = msgTp.replace("{avatar}", data.avatar)
    msgTp = msgTp.replace("{username}", data.username)
    msgTp = msgTp.replace("{time}", data.time)
    msgTp = msgTp.replace("{content}", data.content)
    msgTp = msgTp.replace("{id}", msgId)
    if (data.isSent) {
        msgTp = msgTp.replace(/{isSent}/g, "is-sent");
        msgTp = msgTp.replace("{isSendUser}", "style='padding: 5px;background-color: #95EC69; color: black;'")
    } else {
        msgTp = msgTp.replace(/{isSent}/g, "");
        msgTp = msgTp.replace("{isSendUser}", "style='padding: 5px;background-color: #F5F5F5; color: black;'")
    }
    // console.log(msgTp)
    return msgTp;
}


/**
 * 向聊天框中追加内容
 * isSent true: 发送人 | false: 回答人
 * avatar: 头像  发送人不穿 | 回答人传: image/chatGpt.png
 * avatar: 名称  发送人：用户 | 回答人传: chatGpt
 */
function appendDivMsg(isSent, avatar, username, content, msgId) {
    // 添加发送信息
    let data = {
        isSent: isSent, avatar: avatar, username: username, time: format(new Date()), content: content
    };
    $("#msgsDiv").append(getMsgDiv(data, msgId))
    // 消息一直位于底部
    document.getElementById("msgsDiv").scrollTop = document.getElementById("msgsDiv").scrollHeight;
}


// ajax-请求(同步请求) --> 1-url  2-数据 3、请求方式 4、返回数据 || -<5、同步false/异步true
function request(url, data, type) {
    // url 空格处理
    url = encodeURI(url);
    // 参数加签
    let timestamp = new Date().getTime();
    // 发起请求
    $.ajax({
        type: type, dataType: "json", url: url, data: JSON.stringify(data), contentType: "application/json;charset=utf-8", headers: {
            "TOKEN": "", "timestamp": timestamp, "sign": ""
        }, async: true, //请求成功
        success: function (res, status, request) {
            //错误打印
            if (res.code !== 200) {
                alert(res.msg);
                throw new Error();
            }

            var respContent = null
            // 错误
            if (res.data.error !== null) {
                respContent = JSON.stringify(res.data.error, null, 4);
            }
            // 响应正确
            if (res.data.result != null) {
                respContent = res.data.result.output.content;
                respContent = escapeHtml(respContent);
            }

            // 聊天框中 展示响应数据
            appendDivMsg(false, "/image/chatgpt.png", "cahtGpt", respContent)
            // 保存最后一条消息
            lastRespContent = respContent;
        }, //请求失败
        error: function (xhr, textStatus, errorThrown) {
            alert('请求失败!');
        }
    });
}


/**
 * Date 时间转 YYYY-MM-DD HH:mm:ss
 *
 * <P>
 *  示例：
 *  import {format} from '@/util/time'
 *  format(new Date())
 * </p>
 * @param dateTime
 * @returns {string}
 */
function format(dateTime) {
    const year = dateTime.getFullYear()
    const month = dateTime.getMonth() + 1 > 9 ? dateTime.getMonth() + 1 : '0' + (dateTime.getMonth() + 1)
    const day = dateTime.getDate() > 9 ? dateTime.getDate() : '0' + dateTime.getDate()

    const hour = dateTime.getHours() > 9 ? dateTime.getHours() : '0' + dateTime.getHours()
    const minute = dateTime.getMinutes() > 9 ? dateTime.getMinutes() : '0' + dateTime.getMinutes()
    const second = dateTime.getSeconds() > 9 ? dateTime.getSeconds() : '0' + dateTime.getSeconds()
    return `${year}-${month}-${day} ${hour}:${minute}:${second}`
}

//生成指定长度的随机字符串的函数
function randomString(len) {
    len = len || 32;
    var $chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678';
    /****默认去掉了容易混淆的字符oOLl,9gq,Vv,Uu,I1****/
    var maxPos = $chars.length;
    var pwd = '';
    for (i = 0; i < len; i++) {
        pwd += $chars.charAt(Math.floor(Math.random() * maxPos));
    }
    return pwd;
}

// 展示时特殊符号转译
function escapeHtml(html) {
    if(html==="python"){
        console.log(html)
    }
    console.log(html)
    if (html == null || html === '') {
        return html;
    }
    var map = {
        '&': '&amp;',
        '<': '&lt;',
        '>': '&gt;',
        '"': '&quot;',
        "'": '&#039;'
    };
    return html.replace(/[&<>"']/g, function (m) {
        return map[m];
    });
}